<!--//照搬的时候注意在vuex里面定义  this.$store.commit("progectile");控制组件显示隐藏的 同时在父组件的子组件标签上也加上v-show="this.$store.state.progectile"判断一下-->
<!--<template>-->
<!--    <div class="progectile">-->
<!--        <span class="del" @click="hidden"></span>-->
<!--        <span class="password">密码</span>-->
<!--        <input ref="pwd" type="tel" maxlength="6" v-model="msg" class="pwd" unselectable="on" />-->
<!--        <ul class="pwd-wrap" @click="focus">-->
<!--            <li :class="msg.length == 0?'psd-blink':''"><i v-if="msg.length > 0"></i></li>-->
<!--            <li :class="msg.length == 1?'psd-blink':''"><i v-if="msg.length > 1"></i></li>-->
<!--            <li :class="msg.length == 2?'psd-blink':''"><i v-if="msg.length > 2"></i></li>-->
<!--            <li :class="msg.length == 3?'psd-blink':''"><i v-if="msg.length > 3"></i></li>-->
<!--            <li :class="msg.length == 4?'psd-blink':''"><i v-if="msg.length > 4"></i></li>-->
<!--            <li :class="msg.length == 5?'psd-blink':''"><i v-if="msg.length > 5"></i></li>-->
<!--        </ul>-->
<!--        &lt;!&ndash; <input type="password" class="inputpra" onkeyup="value=value.replace(/[^(\d)]/g,'')" maxlength="6" v-model="pass" :class="pass.length=='6'?'active':''"/> &ndash;&gt;-->
<!--        <span class="confirm" @click="refer">确认</span>-->
<!--    </div>-->
<!--</template>-->

<!--<script>-->
<!--    export default {-->
<!--        name:'payMoney',-->
<!--        data() {-->
<!--            return {-->
<!--                msg: ""-->
<!--            };-->
<!--        },-->
<!--        props:{-->
<!--            ask:String-->
<!--        },-->
<!--        watch: {-->
<!--            msg(curVal) {-->
<!--                if (/[^\d]/g.test(curVal)) {-->
<!--                    this.msg = this.msg.replace(/[^\d]/g, "");-->
<!--                }-->
<!--            }-->
<!--        },-->
<!--        methods: {-->
<!--            hidden() {-->
<!--                //控制支付弹框显示隐藏的变量-->
<!--                this.$store.commit("progectile");-->
<!--                this.msg = "";-->
<!--            },-->
<!--            focus() {-->
<!--                this.$refs.pwd.focus();-->
<!--            },-->
<!--            async refer() {-->
<!--                if (!this.msg) {-->
<!--                    this.$toasted.error("请输入完善信息", { icon: "error" }).goAway(2000);-->
<!--                    return;-->
<!--                }-->
<!--                try {-->
<!--                    // await等待一个异步返回的结果 如果没有await 会报user is undefined 获取不到-->
<!--                    let { id, num } = this.$store.state.buydetosit;-->
<!--                    let res = await this.http.post(this.ask, {-->
<!--                        security: this.msg,-->
<!--                        id: id,-->
<!--                        num: num-->
<!--                    });-->
<!--                    if (res.code == 200) {-->
<!--                        this.$toasted.success(res.message).goAway(1500);-->
<!--                        this.$store.commit("progectile");-->
<!--                        this.msg = "";-->
<!--                    } else {-->
<!--                        this.$toasted.error(res.message, { icon: "error" }).goAway(2000);-->
<!--                        this.$store.commit("progectile");-->
<!--                        this.msg = "";-->
<!--                    }-->
<!--                } catch (error) {-->
<!--                    this.$toasted.error(error.message, { icon: "error" }).goAway(2000);-->
<!--                    this.$store.commit("progectile");-->
<!--                    this.msg = "";-->
<!--                }-->
<!--            }-->
<!--        },-->
<!--        created() {-->
<!--            this.$store.commit("progectilefalse");-->
<!--        }-->
<!--    };-->
<!--</script>-->

<!--<style scoped>-->
<!--    .progectile {-->
<!--        width: 90%;-->
<!--        height: 3.5rem;-->
<!--        position: fixed;-->
<!--        top: 4rem;-->
<!--        bottom: 4rem;-->
<!--        left: 5%;-->
<!--        z-index: 9;-->
<!--        display: flex;-->
<!--        flex-direction: column;-->
<!--        box-shadow: 1px 1px 5px #888888;-->
<!--        background: #ffffff;-->
<!--    }-->
<!--    .progectile .del {-->
<!--        width: 0.5rem;-->
<!--        height: 0.5rem;-->
<!--        background: url("../../../public/image/close.png") no-repeat;-->
<!--        background-size: 0.5rem 0.5rem;-->
<!--        margin-left: 92%;-->
<!--    }-->
<!--    .progectile .password {-->
<!--        font-size: 0.4rem;-->
<!--        margin: 0 auto;-->
<!--    }-->
<!--    .progectile .inputpra {-->
<!--        width: 5.5rem;-->
<!--        height: .8rem;-->
<!--        background: url("../../../public/image/weibiaoti1.png") no-repeat;-->
<!--        background-size: 100% 0.8rem;-->
<!--        padding-left: .4rem;-->
<!--        padding-right: -.4rem;-->
<!--        letter-spacing: 0.67rem;-->
<!--        font-size: 0.5rem;-->
<!--        overflow: hidden;-->
<!--        position: absolute;-->
<!--        top: 45%;-->
<!--        left: 50%;-->
<!--        transform: translate(-50%,-38%);-->
<!--        color: black;-->
<!--        text-shadow: 0 0 0 black;-->
<!--    }-->
<!--    .progectile .inputpra.active {-->
<!--        color: transparent;-->
<!--    }-->
<!--    .progectile .confirm {-->
<!--        width: 100%;-->
<!--        text-align: center;-->
<!--        height: 1rem;-->
<!--        line-height: 1rem;-->
<!--        font-size: 0.4rem;-->
<!--        color: #5136d9;-->
<!--        border-top: 1px solid #5136d9;-->
<!--        margin-top: 24%;-->
<!--    }-->
<!--    input {-->
<!--        width: 0.1px;-->
<!--        height: 0.1px;-->
<!--        color: transparent;-->
<!--        position: relative;-->
<!--        top: .23rem;-->
<!--        background: #000000;-->
<!--        left: .46rem;-->
<!--        border: none;-->
<!--        font-size: 18px;-->
<!--        opacity: 0;-->
<!--        z-index: -1;-->
<!--    }-->

<!--    .psd-blink {-->
<!--        display: inline-block;-->
<!--    }-->
<!--    .pwd-wrap {-->
<!--        width: 90%;-->
<!--        height: 1rem;-->
<!--        padding-bottom: 1px;-->
<!--        margin: 0 auto;-->
<!--        background: #fff;-->
<!--        border: 1px solid #ddd;-->
<!--        display: flex;-->
<!--        justify-content: space-between;-->
<!--        cursor: pointer;-->
<!--        position: absolute;-->
<!--        left: 0;-->
<!--        right: 0;-->
<!--        top: 32%;-->
<!--        z-index: 0;-->
<!--    }-->
<!--    li {-->
<!--        list-style:none;-->
<!--        text-align: center;-->
<!--        line-height: 1rem;-->
<!--        -webkit-box-flex: 1;-->
<!--        width: 15%;-->
<!--        border-right: 1px solid #ddd;-->
<!--        background: #888888;-->
<!--    }-->
<!--    i {-->
<!--        height: .2rem;-->
<!--        width: .2rem;-->
<!--        border-radius: 50%;-->
<!--        background: #000;-->
<!--        display: inline-block;-->
<!--    }-->
<!--</style>-->
